<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="renderer" content="webkit">
<meta name="force-rendering" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
<link charset="utf-8" rel="stylesheet" type="text/css" href="/static/ali/ali.css" />
<link charset="utf-8" rel="stylesheet" type="text/css" href="/static/ali/home.css" />
<title>友利钱包账户中心</title>
</head>
<body>
	#include("common/header.html", site="home")

	<div class="content">
		<div class="content-wrapper">
			<div class="content-left">
				<div class="menu-title">账户中心</div>
				<div class="menu-group">#include("common/sider.html", site="paypswd")</div>
			</div>
			<div class="content-right">
				<div class="main-title">密码管理</div>
				<div class="option-panel">
					<div class="tab-container">
						<ul class="nav-tabs">
							<li class="#if(type=='update')active#end"><a href="/customer/home/paypswd/update">修改支付密码</a></li>
							<li class="#if(type=='reset')active#end"><a href="/customer/home/paypswd/reset">重置支付密码</a></li>
							<li class="#if(type=='loginUpdate')active#end"><a href="/customer/home/paypswd/loginUpdate">修改登录密码</a></li>
						</ul>
					</div>
					<form action="/customer/home/paypswd" class="layui-form" method="post">
						<div class="form-item">
							<div class="form-value">
								#if(type=='update' || type=='reset') 
								<div class="form-item">
									<div class="form-label">账户名</div>
									<div class="form-value">
										<span style="color: #fc6621;">#(session.loginMerchUser.userName)</span>
									</div>
								</div>
								#end
								#if(type=='update')
								<input type="hidden" name="type" value="update">
								<div class="form-item">
									<div class="form-label">旧支付密码</div>
									<div class="form-value">
										<input type="password" name="oldPayPassword" placeholder="验证旧支付密码" required lay-verify="required">
									</div>
								</div>
								<div class="form-item">
									<div class="form-label">新支付密码</div>
									<div class="form-value">
										<input type="password" name="payPassword" placeholder="新支付密码" required lay-verify="required" minlength="6" maxlength="6">
									</div>
								</div>
								<div class="form-item">
									<div class="form-label">确认新支付密码</div>
									<div class="form-value">
										<input type="password" name="payPassword2" placeholder="确认两次输入一致" required lay-verify="payPassword2" minlength="6" maxlength="6">
									</div>
								</div>
								#end 
								#if(type=='reset') 
								<input type="hidden" name="type" value="reset">
								<div class="form-item">
									<div class="form-label">短信验证码</div>
									<div class="form-value">
										<input type="text"  name="smscode" placeholder="短信验证码" autocomplete="off" required="required" lay-verify="required|number">
										<button type="button" class="jui-btn jui-btn-blue" id="btnSms">获取</button>
									</div>
								</div>
								<div class="form-item">
									<div class="form-label">新支付密码</div>
									<div class="form-value">
										<input type="password" name="payPassword" placeholder="新支付密码" required lay-verify="required" minlength="6" maxlength="6" >
									</div>
								</div>
								<div class="form-item">
									<div class="form-label">确认新支付密码</div>
									<div class="form-value">
										<input type="password" name="payPassword2" placeholder="确认两次输入一致" required lay-verify="payPassword2" minlength="6" maxlength="6" >
									</div>
								</div>
								#end
								#if(type=='loginUpdate') 
								<div class="form-item">
									请前往老铁牛修改，修改成功后自动同步
								</div>
								#end
							</div>
						</div>
						#if(type=='update' || type=='reset') 
						<div class="form-item">
							<div class="form-label"></div>
							<div class="form-value">
								<button class="jui-btn jui-btn-blue" lay-submit lay-filter="wallet-form-submit">确定</button>
							</div>
						</div>
						#end
					</form>
				</div>
			</div>
		</div>
	</div>

	#include("common/footer.html")
</body>
<script src="/static/layui/layui.js"></script>
<script>
layui.config({
	base: '/static/fly/mods/'
}).use(['layer', 'form'], function(){
	var $ = layui.$, layer = layui.layer, form = layui.form;
	// 表单验证
	form.verify({
		payPassword2: function(value, item) {
			if(value != $("input[name='payPassword']").val()){
				return "两次支付密码输入不一致";
			}
			if(value.length != 6){
				return "请输入6位支付密码";
			}
		}


	});
	// 表单提交
	form.on('submit(wallet-form-submit)', function(data){
		var field = data.field; //获取提交的字段
		$.ajax({
			url: "/customer/home/paypswd",
			type:"post",
			data: field,
			success: function(res){
				if(res.code !== 0){
					layer.msg(res.msg, {icon: 2});
				}else{
					layer.msg("修改成功", {icon: 1});
					$("form")[0].reset();
				}
			},
			error: function(xhr){layer.msg("出错了" + xhr);}
		});
		return false;
	});
	
	// 发送短信验证码
    var timer,second=60,flag = false;
    $("#btnSms").on("click", function (){
    	if(flag)return;
    	flag = true;
    	$.post("/customer/home/sendsms", null, function(data){
    		if(data.code == 0){
    	    	timer = setInterval(() => {
    	    		if(second <= 0) {
    	    			clearInterval(timer);
    	    			second = 60;
    	    			flag = false;
    	    			$("#btnSms").text("获取");
    	    		} else{
    	    			$("#btnSms").text(second);
    	    			second = second - 1;
    	    		}
    	    	}, 1000);
    		}
			layer.msg(data.msg);
    	});
    });
});
</script>
</html>